// miniprogram/pages/Bookiing/booking.js
//获取小程序实例
const app=getApp();
Page({

  /**
   * 页面的初始数据
   */
  data: {
    loading:true,
    mainType:[{
      title:'收入',
      type:'sr'
    },{
      title:'支出',
      type:'zc',
    },
  ],
  activeIndex:0,
  accoutData:[
    {
      title:'现金',
      type:'xj',
    },
    {
      title:'微信',
      type:'wx',
    },
    {
      title:'支付宝',
      type:'zfb',
    },
    {
      title:'信用卡',
      type:'xyk',
    },
    {
      title:'储蓄卡',
      type:'cxk',
    },
  ],
  activeAccoutIndex:-1,

  // 每页显示count个
  count:7,
  // 记账类型数据
  typeData:[],

  // 当前激活的页码
  currentPage:-1,

  //日期范围
  dateRange:{
    start:'',
    end:"",
  },
  // 选择日期
  date:'选择日期'
  },

  //输入金额
  money:'',

  // 备注
  comment:"",

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.getTypeData()
    console.log(app.globalData);

    // 获取当前日期
    let end=new Date();
    let year=end.getFullYear();
    let month=end.getMonth()+1;
    month=month>=10?month:'0'+month
    let date=end.getDate();
    date=date>=10?date:'0'+date
    this.setData({
      dateRange:{
        start:app.globalData.start,
        end:`${year}-${month}-${date}`
      }
    })
    console.log('this.data.dateRange==>',this.data.dateRange);
  },
  // 切换支入支出状态
  // toggleStatus(e)
  // {
  //   // 事件对象
  //   console.log('e==>',e);
  //   // 获取下标
  //   let crrentIndex=e.currentTarget.dataset.index;
  //   console.log('crrentIndex==>',crrentIndex);
  //   // 修改data的属性
  //   if(this.data.activeIndex==crrentIndex)
  //   {
  //     // 处于激活状态
  //     console.log('处于激活状态');
  //     return;
  //   }
  //   this.setData({
  //     activeIndex:crrentIndex
  //   })
  // },

  // 切换账户状态,和支入支出状态
  toggleStatus(e)
  {
    // 获取当前激活状态选项的下标（data-index）
    let currentIndex=e.currentTarget.dataset.index;
    // console.log('currentIndex==>',currentIndex);
    
    // 动态获取data的属性(样式下标data-active)
    let key=e.currentTarget.dataset.active;
    // console.log('key==>',key);

    // 修改data属性（再次点击选中的选项直接return）
    if(this.data[key]==currentIndex)
    {
      return;
    }
    // 把下标给样式下表修改样式(三目运算修改样式)
    this.setData({
      [key]:currentIndex
    })
  },

  // 调用云函数
  getTypeData(){

    // 启动加载..
    wx.showLoading({
      title:'加载中...',
      mask:true
    })

    //调用云端的云函数
    wx.cloud.callFunction({
      name:'get_type',
    }).then(res=>{
      // 关闭加载提示..
      wx.hideLoading();
      console.log('res==>',res);
      // [
      //   {
      //     activeIndex:0,
      //     tupian:[{icon:"",title:""},{icon:"",title:""}]
      //   },
      //   {
      //     activeIndex:0,
      //     tupian:[{icon:"",title:""},{icon:"",title:""}]
      //   }
      // ]
      let data=[];
      for(let i=0; i<res.result.data.length; i+=this.data.count){
        let o={
          activeIndex:-1,
          tupian:res.result.data.slice(i,i+this.data.count)
        }
        data.push(o);
      }
     
      this.setData({
        typeData:data,
        loading:false,
      })
     
      console.log('activeIndex',activeIndex);
    }).catch(err=>{
      console.log('err==>',err);
    })
  },
// 切换记账类型状态
toggleTypeStatus(e)
{
  let currentIndex=e.currentTarget.dataset.index;
  console.log('currentIndex==>',currentIndex);

  let page=e.currentTarget.dataset.page;
 
  if(this.data.typeData[page].activeIndex===currentIndex)
  {
   return;
  }
 
  this.data.typeData[page].activeIndex=currentIndex;
  if(this.data.currentPage !== -1 && this.data.currentPage != page){
    //移除其他页的高亮状态
    this.data.typeData[this.data.currentPage].activeIndex=-1;
  }

  this.data.currentPage=page
  console.log('this.data.currentPage==>',this.data.currentPage);
  this.setData({
    typeData:this.data.typeData
  })
},
// 选取日期
selectDate(e)
{
  // 防止再次点击相同时间影响其他变量
  if(this.data.date==e.detail.value)
  {
    return
  }
  // 获取e.detail.value的数据
  this.setData({
    date:e.detail.value
  })
},

// 输入金额,和输入备注共同方法
inputValue(e)
{
  // 拿到动态键名
  let key=e.currentTarget.dataset.key;

  //保存
  this.setData({
    [key]:e.detail.value
  })
  console.log('this.data[key]==>',this.data[key]);
},

//保存
save()
{
  // 判断是否选择账户类型
  if(this.data.currentPage===-1)
  {
    wx.showToast({
      title: '选择记账类型',
      icon:'none',
      duration:'2000',
    })
    return
  }

  //判断是否选择账户
  if(this.data.activeAccoutIndex===-1)
  {
    wx.showToast({
      title: '选择账户',
      icon:'none',
      duration:'2000',
    })
    return
  }
  // 是否选择日期
  if(this.data.date=='选择日期')
  {
    wx.showToast({
      title: '选择日期',
      icon:'none',
      duration:'2000',
    })
    return
  }
  // 是否选择金额
  if(this.data.money==="")
  {
    wx.showToast({
      title: '填写金额',
      icon:'none',
      duration:'2000',
    })
    return
  }
  // 获取记账数据

  // 收入支出
    let mainType=this.data.mainType[this.data.activeIndex];

    // 记账类型
    let data=this.data.typeData[this.data.currentPage];
    let subType=data.tupian[data.activeIndex];
    
    // 账户
    let accout=this.data.accoutData[this.data.activeAccoutIndex];

    console.log('mainType==>',mainType);
    console.log('subType==>',subType);
    console.log('accout==>',accout);


    //调用云函数
    wx.cloud.callFunction({
      name:'add_booking',
      data:{
        mainType,
        subType,
        accout,
        money:this.data.money,
        date:this.data.date,
        comment:this.data.comment,
      }
    }) .then(res=>{
      wx.hideLoading();
      console.log('Yunres==>',res);
      if(res.result._id)
      {
        wx.showToast({
          title:'保存成功',
          icon:'success',
          duration:2000,
        })

        // 点击保存之后就清空输入和选中
        this.data.typeData[this.data.currentPage].activeIndex=-1;
        this.setData({
         typeData:this.data.typeData,
          date:'日期选择',
          comment:'',
          currentPage:-1,
          accountIndex:-1,
          money:'',
  
        })
      }else{
        wx.showToast({
          title:'保存失败',
          icon:'error',
          duration:2000,
        })
      }
    }).catch(err=>{
      wx.hideLoading();
      console.log('Yunerr==>',err);
    })
},

  // 
  
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    setTimeout(()=>{

      this.setData({
        loading:false
      })
    },1000)
  },


})